import React from 'react';

var scope;
export default class GoodsList extends React.Component{

    constructor(props){
        super(props);
        scope = this;
    };

    render(){
        var goodsItems = scope.props.data.map(function(obj,i){
            var isRight = false;
            if(i % 2 == 0){
                isRight = true;
            }
            return (
                <li key={'goods-' + obj.goods_common_id}>
                    <a href={"goods-view.html?goods_common_id=" + obj.goods_common_id + "&appid=" + scope.props.appId} >
                        {scope.goodsInfo(isRight,obj)}
                        {scope.goodsImg(isRight,obj)}
                        <div className="direction"></div>
                    </a>
                </li>
            );
        });

        return (
            <ul className="goods-list">
                {goodsItems}
            </ul>
        );
    };

    goodsInfo(isRight,obj){
        var direction = 'f-fl';
        if(isRight){
            direction = 'f-fr';
        }
        return (
            <div className={"goods-info-box " + direction}>
                <div className="goods-name">{obj.gc_name}<span className="point"></span></div>
                <div className="horizontal-line"></div>
                <p className="goods-desc">{obj.gc_desc}</p>
                <div className="box-bottom">
                    <div className="spec-num-box">{obj.gc_spec}</div>
                    <div className="goods-price-box">RMB<span className="price-text">{obj.market_price}</span>起</div>
                </div>
            </div>
        );
    };

    goodsImg(isRight,obj){
        var direction = 'f-fl';
        if(isRight){
            direction = 'f-fr';
        }
        return (
            <div className={"goods-img-box " + direction} >
                <img src={obj.gc_thumb} alt={obj.gc_name}/>
            </div>
        );
    };

};